<template>
  <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
    <!--<FormItem>-->
      <Row>
        <FormItem prop="title" label="歌曲名:">
          <Input v-model="formValidate.title" placeholder="请输入日志标题"></Input>
        </FormItem>
      </Row>
      <Row>
        <FormItem prop="account" label="歌手:">
          <Input v-model="formValidate.title" placeholder="请输入日志标题"></Input>
        </FormItem>
      </Row>
    <Row>
      <Col span="10">
      <FormItem label="图片:" prop="touxiang">
        <upload ref="picref"></upload>
      </FormItem>
      </Col>

      <Col span="10">
      <FormItem label="歌曲:" prop="">
        <upload ref=""></upload>
      </FormItem>
      </Col>
    </Row>

    <FormItem>

      <Button type="primary" @click="handleSubmit()">提交</Button>
      <Button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</Button>
      <Button type="primary" @click="fanhui()" style="margin-left: 8px">返回</Button>
    <!--  <div style="height: 50px;width: 100px">
        <router-link :to="showLogger">
          <div>
            <Button type="primary" >
              返回
            </Button>
          </div>
        </router-link>
      </div>-->
    </FormItem>

  </Form>
</template>

<script>
  import upload from  '../utils/share_upload_pic';
  // import upload from  '../person/person_list.vue';
  export default {
    data () {
      return {
        showLogger:'showLogger',
        formValidate: {
          title: '',
          account: '',
          touxiangurl: ''
        },
        ruleValidate: {
          title: [
            { required: true, message: '标题不能为空！', trigger: 'blur' }
          ],
          account: [
            { required: true, message: '内容不能为空！', trigger: 'blur' }
          ],
        }
      }
    },
    components: {
      upload
    },
    methods: {
      fanhui(){
        this.$router.replace({ path: '/showLogger'});
      },
      handleSubmit () {
        let self=this;
        console.log("self.formValidate====",self.formValidate);
        console.log("file......................",this.$refs.picref.file);
        console.log("file......................",this.$refs.picref.file.realurl);
        self.formValidate.touxiangurl=this.$refs.picref.file.realurl;
        this.$http.post("/api/person/save/",self.formValidate)
          .then(response => {
            if(response.data.code==500){
              alert("保存成功！");
              this.$router.replace({ path: '/home'})
            }
            else{
              alert("保存失败！");

            }
          }, response => {
            console.log("获取信息失败");
            alert("保存失败！");
          })
      },
      handleReset (name) {
        this.$refs[name].resetFields();
      }
    }
  }
</script>
